<template>
	<fui-swiper-dot :items="items" :current="current">
		<swiper class="fui-banner__wrap" @change="change" circular :indicator-dots="false" autoplay :interval="4000"
			:duration="150">
			<swiper-item v-for="(item,index) in items" :key="index">
				<view class="fui-banner__item" :style="{background:`url(${item.img})`,backgroundSize:'100% 100%'}">
				</view>
			</swiper-item>
		</swiper>
	</fui-swiper-dot>
</template>

<script setup>
	import {
		swiperItem
	} from '../../config/index.js'
	import {
		ref
	} from 'vue'
	let current = ref(0)
	let items = swiperItem

	let change = (e) => {
		current.value = e.detail.current;
	}
</script>

<style scoped lang="scss">
	.fui-banner__item {
		width: 100%;
		height: 360rpx;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 34rpx;
		font-weight: 600;
	}

	.fui-banner__wrap {
		height: 360rpx;
	}
</style>